<template>
  <view class="package_sale" v-for="(item) in orderLists" :key="item.id" style="position:relative">
    <text class="fill_text" :style="{
        background: item.status_text == '已完成' ? '#ECECEC' : '',
        color: item.status_text == '已完成' ? '#333' : '',
      }" v-if="props.status">
      {{ item.status_text }}
    </text>
    <view class="space-between">
      <text>订单号：{{ item.order_sn }}</text>
    </view>
    <view class="space-between" style="margin: 15rpx 0px">
      <text>{{ item.product_name }}</text>
      <text>{{ item.fill_amount }}公斤</text>
    </view>
    <view class="space-between">
      <view v-if="item.order_type !== 'customers_filling'">{{ item.fill_price }}元/公斤</view>
      <view v-else></view>
      <view>
        <text>消费金额￥</text>
        <text style="font-size: 30rpx">{{ item.fill_fee }}</text>
      </view>
    </view>
    <view class="space-between" style="margin-top: 20rpx">
      <view>{{ item.createtime }}</view>
      <view>
        <text style="margin-left: 20rpx">{{ item.cart_code }}</text>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
  import { PropType } from 'vue';
  const props = defineProps({
    orderLists: {
      type: Array as PropType<Array<any>>,
    },
    status: {
      type: Boolean,
    },
  });
</script>

<style scoped lang="less">
  .fill_text {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 119rpx;
    height: 54rpx;
    background: linear-gradient(-24deg, #fe9b00, #ffbd56);
    border-radius: 0rpx 0px 0px 5px;
    text-align: center;
    line-height: 54rpx;
    color: #ffffff;
  }
</style>